<template>
  <d2-container >
      <el-tabs v-model="activeName"  type="border-card">
        <el-tab-pane label="缓存刷新" name="common">
          <el-form :model="form" ref="common" label-position="left" label-width="100px">
               <el-form-item label="类型">
                <div>
                  <el-radio-group v-model="form.file_type">
                    <el-radio-button label="url">url</el-radio-button>
                    <el-radio-button label="directory">目录</el-radio-button>
                  </el-radio-group>
                </div>
              </el-form-item>
               <el-form-item label="urls">
                <div>
                  <el-input
                    type="textarea"
                    :autosize="{ minRows: 8, maxRows: 10}"
                    placeholder="请输入要刷新的url，以/结尾，如https://www.baidu.com/,多个url以换行隔开"
                    v-model="form.urls">
                  </el-input>
                </div>
              </el-form-item>
          </el-form>
          <el-row>
            <el-button type="primary" icon="el-icon-check" @click="subMit('form')">提交</el-button>
          </el-row>
        </el-tab-pane>
      </el-tabs>
  </d2-container>
</template>


<script>
import * as api from './api'

export default {
  name: 'basic',
  created () {
    this.loadData()
  },
  // mixins: [d2CrudPlus.crud],
  data () {
    return {
      activeName: 'common',
      urls: [],
      form: {
        file_type: 'directory',
        urls: []
      }
    }
  },
  methods: {
    loadData () {
      const query = {limit: '9999'}
      api.GetList(query).then((ret) => {
        for (const item of ret.data.data) {
          this[item.type][item.name] = item.value
        }
      })
    },
    subMit (form) {
      const data = this[form]
      this[form].urls = this[form].urls.split('\n')
      api.createObj(data)
      this.$notify.success({
        title: 'Info',
        message: '提交成功'
      })
    },
    resetForm (formName) {
      console.log(this.$refs[formName])
      this.$refs[formName].resetFields()
      this.$notify.success({
        title: 'Info',
        message: '重置成功'
      })
    }
  }
}
</script>

<style lang="scss">
.yxtInput {
  .el-form-item__label {
    color: #49a1ff;
  }
}
</style>
